// script.js
//document.addEventListener('DOMContentLoaded', () => {
    // 显示登录表单
    function showLoginForm() {
        document.getElementById('loginContainer').style.display = 'block';
        document.getElementById('registerContainer').style.display = 'none';
        document.getElementById('managementContainer').style.display = 'none';
        document.getElementById('addStudentContainer').style.display = 'none';
    }
    showLoginForm(); // 默认显示登录表单

    // 显示注册表单
    function showRegisterForm() {
        document.getElementById('loginContainer').style.display = 'none';
        document.getElementById('registerContainer').style.display = 'block';
        document.getElementById('managementContainer').style.display = 'none';
        document.getElementById('addStudentContainer').style.display = 'none';
    }

    // 登录功能
    document.getElementById('loginForm').addEventListener('submit', async (e) => {
        e.preventDefault();
        const username = document.getElementById('username').value;
        const password = document.getElementById('password').value;
        const response = await fetch('/login', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ username, password })
        });
        const data = await response.json();
        if (data.success) {
            showManagementForm(); // 登录成功，显示管理界面
        } else {
            document.getElementById('loginMessage').innerText = '登录失败，请重试。';
        }
    });

    // 注册功能
    document.getElementById('registerForm').addEventListener('submit', async (e) => {
        e.preventDefault();
        const username = document.getElementById('registerUsername').value;
        const password = document.getElementById('registerPassword').value;
        const response = await fetch('/register', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ username, password })
        });
        const data = await response.json();
        if (data.success) {
            document.getElementById('registerMessage').innerText = '注册成功，请登录。';
            showLoginForm(); // 注册成功，返回登录界面
        } else {
            document.getElementById('registerMessage').innerText = '注册失败，请重试。';
        }
    });

    // 显示管理界面
    function showManagementForm() {
        document.getElementById('loginContainer').style.display = 'none';
        document.getElementById('registerContainer').style.display = 'none';
        document.getElementById('managementContainer').style.display = 'block';
        document.getElementById('addStudentContainer').style.display = 'none';
        loadStudents(); // 加载学生数据
    }

    // 加载学生数据
    async function loadStudents() {
        const response = await fetch('/students');
        const data = await response.json();
        const tbody = document.getElementById('studentTableBody');
        tbody.innerHTML = ''; // 清空表格内容
        data.forEach(student => {
            const tr = document.createElement('tr');
            tr.innerHTML = `
                <td>${student.id}</td>
                <td>${student.name}</td>
                <td>${student.age}</td>
                <td>${student.gender}</td>
                <td>${student.score}</td>
                <td><button class="viewInf">查看</button><button class="updateInf">修改</button><button class="deleteInf">删除</button></td>
            `;
            tbody.appendChild(tr);
        });
    }

    // 查找学生数据
    document.getElementById('searchForm').addEventListener('submit', (e) => {
        e.preventDefault();
        const keyword = document.getElementById('searchInput').value;
        const response = fetch(`/search?keyword=${keyword}`);
        response.then(response => response.json())
            .then(data => {
                const tbody = document.getElementById('studentTableBody');
                tbody.innerHTML = ''; // 清空表格内容
                data.forEach(student => {
                    const tr = document.createElement('tr');
                    tr.innerHTML = `
                        <td>${student.id}</td>
                        <td>${student.name}</td>
                        <td>${student.age}</td>
                        <td>${student.gender}</td>
                        <td>${student.score}</td>
                        <td><button class="viewInf">查看</button><button class="updateInf">修改</button><button class="deleteInf">删除</button></td>
                    `;
                    tbody.appendChild(tr);
                });
            });
    });

    // 增加学生数据
    document.getElementById('addStudentForm').addEventListener('submit', async (e) => {
        e.preventDefault();
        const name = document.getElementById('addStudentName').value;
        const age = document.getElementById('addStudentAge').value;
        const gender = document.getElementById('addStudentGender').value;
        const score = document.getElementById('addStudentScore').value;
        const response = await fetch('/add', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ name, age, gender, score })
        });
        const data = await response.json();
        if (data.success) {
            document.getElementById('addStudentMessage').innerText = '添加学生成功！';
            showManagementForm(); // 加载学生数据
        } else {
            document.getElementById('addStudentMessage').innerText = '添加学生失败，请重试。';
        }
    });

    // 修改学生数据
    document.body.addEventListener('click', (e) => {
        if (e.target.matches('.updateInf')) {
            const tr = e.target.closest('tr');
            const id = tr.children[0].innerText;
            const name = tr.children[1].innerText;
            const age = tr.children[2].innerText;
            const gender = tr.children[3].innerText;
            const score = tr.children[4].innerText;

            document.getElementById('updateStuName').value = name;
            document.getElementById('updateStuAge').value = age;
            document.getElementById('updateStuGender').value = gender;
            document.getElementById('updateStuScore').value = score;

            document.getElementById('updateStudentForm').style.display = 'block';
            e.stopPropagation();
        }
    });

    // 删除学生数据
    document.body.addEventListener('click', (e) => {
        if (e.target.matches('.deleteInf')) {
            const tr = e.target.closest('tr');
            const id = tr.children[0].innerText;

            const response = fetch(`/delete?id=${id}`);
            response.then(response => response.json())
                .then(data => {
                    if (data.success) {
                        tr.remove();
                        document.getElementById('deleteStuMessage').innerText = '删除学生成功！';
                    } else {
                        document.getElementById('deleteStuMessage').innerText = '删除学生失败，请重试。';
                    }
                });
            e.stopPropagation();
        }
    });


